<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1>Todo List</h1>
<form id="form" onsubmit="return false;">
      <input type="text" class="input" id="input" placeholder="Enter your todo" autocomplete="off">
      <ul class="todos" id="todos"></ul>
</form>
</body>
<script>
    let input =   document.querySelector('#input')
    let ul = document.querySelector('#todos')
    let id=0;
    var m=0;
    
    function a(as){
        as.setAttribute("style","color:red;")
    }
    input.onkeydown=function(){
        if (event.keyCode == 13){
           var li=document.createElement("li");
            li.innerHTML=input.value;
            var MyULID="li"+m++;
            li.setAttribute("id",MyULID);
            li.setAttribute("onclick", "a("+MyULID+")");
            ul.appendChild(li);

        }
       }
</script>
</html>